<template>
  <div>
    <el-transfer
      filterable
      filter-placeholder="输入姓名搜索"
      @change="transferChange"
      v-model="userIds"
      :titles="['可选择', '已选择']"
      :button-texts="['移除', '选择']"
      :data="resetData">
    </el-transfer>
  </div>
</template>

<script>
  export default {
    name: "UserTransfer",
    model: {
      prop: 'mval',
      event: 'modelValue'
    },
    props: ['mval','roleId'],
    watch:{
      roleId(){
        this.api.post('/bucket-system/system/user/queryByRoleId?roleId='+this.roleId)
          .then((data) => {
            this.userData = data.data;
            this.userData.forEach(item =>{
              this.resetData.push({
                key: item.id,
                label: item.name
              })
            })
          });
      },
    },
    mounted: function() {
    },
    data() {
      return {
        userData: [],
        resetData: [],
        userIds:[],
      }
    },
    methods: {
      transferChange(obj){
        this.$emit('modelValue', obj)
      },
    }
  }
</script>

<style scoped>

</style>
